<%@ page language="java" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel=stylesheet href="css/jquery.calendarPicker.css" type="text/css" media="screen">
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.calendarPicker.js"></script>
<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
<title>查询页面</title>
</head>
<body>
	<!-- <a href="#" onclick="startCalendarPicker.changeDate(new Date())">今天</a> -->
	<table border="1px" cellpadding="0" cellspacing="0" bordercolor="#616D7E">
		<tr>
			<td style="width: 120px">查询开始日期</td>
			<td style="width: 180px"><span id="start" /></td>
			<td style="width: 120px">查询结束日期</td>
			<td style="width: 180px"><span id="end" /></td>
		</tr>
		<tr>
			<td colspan="2">
				<div id="startDiv" style="width: 200px"></div>
			</td>
			<td colspan="2">
				<div id="endDiv" style="width: 200px"></div>
			</td>
		</tr>
	</table>
	<input class="sumbit" type="button" value="查询">
	<div id="resultList"></div>
	
	<script type="text/javascript">
		jQuery(function() {
			jQuery('.sumbit').click(
					function() {
						jQuery.getJSON('jqueryAjax', function(data) {
							var items = [];
							var result = data;
							jQuery.each(data, function(key, val) {
								if (key == 'groups') {
									jQuery.each(data.groups, function(key2, val2) {
										jQuery.each(val2, function(key3, val3) {
										if(key3=='keywords'){
											jQuery.each(val3, function(key4, val4) {
												jQuery.each(val4, function(key5, val5) {												
												items.push('<li id="' + key5 + '">----' +key5+'='+ val5 + '</li>');
												});
											});
										}else
											items.push('<li id="' + key3 + '">-' +key3+'='+ val3 + '</li>');
										});													
									});
								} else
									items.push('<li id="' + key + '">' + key + '=' + val + '</li>');
							});
							jQuery('<ul/>', {
								html : items.join('')
							}).appendTo('body');
						});
					});
		});

		var startCalendarPicker = jQuery("#startDiv").calendarPicker({
			years : 1,
			months : 2,
			days : 3,
			showDayArrows : false,
			callback : function(cal) {
				jQuery("#start").html(cal.currentDate.toISOString());
			}
		});

		var endCalendarPicker = jQuery("#endDiv").calendarPicker({
			years : 1,
			months : 2,
			days : 3,
			showDayArrows : false,
			callback : function(cal) {
				jQuery("#end").html(cal.currentDate.toISOString());
			}
		});
	</script>
</body>
</html>